:root {
    --f-table-border: #ededed;
}

.table-page {
    margin: 0 15px 1rem;
    padding: 15px;
    background-color: #fff;
    border-radius: 4px;
}

.table-search-box {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}



.table-search-box .search-item,
.table-search-box .table-query-item {
    display: flex;
    align-items: center;
    margin-right: 15px;
    padding: 0 0 0.6em;
}

.search-item>label,
.search-item>.label,
.table-query-item>label,
.table-query-item>.label {
    min-width: 5em;
    text-align: right;
    font-weight: normal;
    font-size: 0.57rem;
    color: var(--f-label-color);
    font-weight: 500;
}


.table-operation-box {
    display: flex;
    align-items: center;
    width: 100%;
    padding: 0.3rem 1rem;
    background-color: #fbfbfb;
    border-top: 1px solid var(--f-table-border);
    border-left: 1px solid var(--f-table-border);
    border-right: 1px solid var(--f-table-border);
}

.table-operation-box button {
    margin-bottom: 0 !important;
}

.table-edit-from .el-input,
.table-edit-from .el-textarea {
    max-width: 20em;
}

.table-edit-from .el-form-item__label {

    text-align: right;

}

.table-operator-column {
    padding: 0 1em;
}

.table-data-box .el-table thead tr {
    color: #32353A;
    font-weight: 500;
    height: 44px;
    font-size: 14px;
}


.table-data-box .el-table thead th {
    background-color: #fbfbfb;
    text-align: center;
    border-color: var(--f-table-border) !important;
}

.table-data-box .el-table,
.table-data-box .el-table td {
    border-color: var(--f-table-border) !important;
}

.table-data-box .el-table td {
    padding: 10px 0;
}

.table-data-box .el-table td.is-left .cell {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.table-page-box .el-pagination {
    margin: 15px 1rem 0;
}

.table-page-box {
    min-height: 24px;
    background-color: white;
    justify-content: flex-end;
}

.table-data-box .el-table::before {
    background-color: var(--f-table-border);
}

.table-data-box .el-table__fixed::before,
.table-data-box .el-table__fixed-right::before {
    background-color: var(--f-table-border);
}

.form-page {
    flex-grow: 1;
    width: 100%;
    padding: 15px 15px 0;
    position: relative;
    margin-bottom: 4rem;
}

.form-page .data-form {
    align-self: stretch;
    padding: 0 15px 15px;
    background-color: #fff;
    border-radius: 4px;
}

.form-page .data-form>.form-item {
    overflow: hidden;
    border-bottom: 1px solid #E5E8EC;
}

.form-page .data-form>.form-item:last-child {
    border-bottom: none;
}

.form-page .form-item:not(.from-operation) {
    flex-direction: column;
}

.form-page .form-item .title {
    padding: 30px 0;
    font-size: 0.92rem;
    font-weight: bold;
}

.form-page .form-item .data {
    display: grid;
    grid-template-columns: repeat(3, auto);
    grid-column-gap: 50px;
    width: fit-content;
}

.form-page .from-operation {
    background-color: #fff;
    padding: 15px 0;
    border-radius: 4px;
    position: fixed;
    bottom: 8px;
    margin-bottom: 0;
    box-shadow: 0px 0px 10px -5px rgba(0, 0, 0, 0.25);
}

.full-dialog {
    width: 100vw !important;
    min-height: 100vh !important;
    margin: 0 !important;
}

.table-edit-from.border-form {
    border: 1px solid #ececec;
    border-radius: 0.4rem;
}

.edit-box {
    display: flex;
    flex-wrap: nowrap;
}

.edit-box .label {
    width: 8em;
    text-align: right;
    margin-right: 0.5em;
}

.el-dialog.one-dialog {
    width: 460px;
}

.el-dialog.two-dialog {
    width: 680px;
}

.el-dialog.three-dialog {
    width: 780px;
}

.el-dialog.two-dialog .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.el-dialog.three-dialog .row {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.el-dialog.two-dialog .el-form .el-input-number .el-input,
.el-dialog.one-dialog .el-form .el-input-number .el-input {
    width: auto;
}

.el-dialog.three-dialog .el-form .el-input-number .el-input,
.el-dialog.one-dialog .el-form .el-input-number .el-input {
    width: auto;
}

.el-dialog.three-dialog .el-form .el-input,
.el-dialog.two-dialog .el-form .el-input,
.el-dialog.three-dialog .el-form .el-textarea,
.el-dialog.two-dialog .el-form .el-textarea {
    width: 230px;
}

.el-dialog.one-dialog .el-form .el-input {
    width: 338px;
}

.el-form-item.is-required:not(.is-no-asterisk)>.el-form-item__label:before,
.el-form-item.is-required:not(.is-no-asterisk) .el-form-item__label-wrap>.el-form-item__label:before {
    margin-right: 0;
}

.el-dialog .el-dialog__header {
    border-bottom: 1px solid #eee;
}

.el-dialog.one-dialog .el-dialog__footer,
.el-dialog.two-dialog .el-dialog__footer {
    border-top: 1px solid #eee;
    text-align: right;
}

.el-dialog.one-dialog .el-dialog__footer,
.el-dialog.three-dialog .el-dialog__footer {
    border-top: 1px solid #eee;
    text-align: right;
}

.el-button {
    font-weight: 500 !important;
}

.el-table {
    overflow: auto;
}

.el-table__header-wrapper,
.el-table__body-wrapper,
.el-table__footer-wrapper {
    overflow: visible;
}

.el-table__body-wrapper {
    overflow-x: visible !important;
}

/* 这个是为了解决前面样式覆盖之后伪类带出来的竖线 */
.el-table::after {
    position: relative;
}

.el-dialog__wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

.el-dialog__wrapper .el-dialog {
    margin-top: 0 !important;
}

.el-dialog__wrapper .el-dialog .el-dialog__body {
    overflow: auto;
    max-height: 80vh;
}

.el-button--text.warning.is-disabled {
    color: #ffd666;
}

.el-button--text.warning {
    color: #ffba00;
}

.el-button--text.danger.is-disabled {
    color: #fef0f0;
}

.el-button--text.danger {
    color: #F56C6C;
}

.el-button--text.primary.is-disabled {
    color: #00ffff;
}

.el-button--text.primary {
    color: #00d0d0;
}
